<template>
	<div>
		<div class="team" >
			
			<el-button style="margin-left:1050px ;" type="primary" icon="el-icon-edit" plain @click="add()">添加团队</el-button>
			<el-table :data="tableData" style="width: 100%" :default-sort="{ prop: 'date', order: 'descending' }" size="mini">
				<el-table-column prop="id" label="ID" sortable width="180"></el-table-column>
				<el-table-column prop="name" label="团队名称" sortable width="180"></el-table-column>
				<el-table-column prop="principal" label="负责人"></el-table-column>
				<el-table-column prop="qa" label="QA负责人"></el-table-column>
				<el-table-column label="操作">
					<template slot-scope="scope">
					<el-button type="primary" icon="el-icon-s-custom" @click="detaile(scope.row)">详情</el-button>
					<el-button type="danger" icon="el-icon-delete" @click="deleteById(scope.row.id)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>
		</div>
		
		<el-dialog :title="title" :visible.sync="show" :close-on-click-modal="false" width="500px">
			<TeamAdd v-if="show" :show.sync="show" @getData="getData()"></TeamAdd>
		</el-dialog>
		
	</div>
</template>

<script>
import axios from '../../utils/axiosutils.js';
import TeamAdd from "./team-add.vue";
export default {
	name: 'Team',
	data() {
		return {
			title:'',
			show:false,
			tableData:[],
		};
	},
	components:{
		TeamAdd
	},
	created() {
		this.getData();
	},
	methods:{
		getData(){
			axios.get(
				"/team/list",
				resp=>{
					this.tableData=resp.obj.records;
				}
			)
		},
		add(){
			this.show=true;
		},
		detaile(row){
			this.$router.push({
			        path: '/teamUser',
			        name: "团队人员", // 要跳转的路径的 name,可在 router 文件夹下的 index.js 文件内找
			        params: {name:row.name}
			});
		},
		deleteById(id){
			axios.post('/team/deleteById',resp=>{
				this.$message.success("删除成功");
				this.getData();
			},{id:id})
		}
	}
};
</script>

<style scoped>
.team{
	padding: 50px;
	box-shadow: 5px 5px 5px #888888;
	border:1px #919191 solid ;
}
</style>
